import './css/index.css'
import './scss/index.scss'
import home from './html/home.html'
import my from './html/my.html'
import classify from './html/classify.html'
import Swiper from 'swiper'
import '../node_modules/swiper/swiper-bundle.css'



let footer = document.querySelector('footer'),
  main = document.querySelector('main'),
  header = document.querySelector('header');


[...footer.children].forEach(v => v.addEventListener('click', () => {
  // 切换高亮
  footer.querySelector('.active').classList.remove('active')
  v.classList.add('active')

  // 切换标题
  header.innerHTML = v.innerHTML


  // 切换内容
  switch (v.innerHTML) {
    case '首页':
      main.innerHTML = home;
      new Swiper('.banner', {
        autoplay: true
      })
      break
    case '发现':
      main.innerHTML = classify
      break
    case '我的':
      main.innerHTML = my
      break
  }
}))


// 默认显示首页
footer.children[0].click()





